<!--
 * @Author: xumeiyi
 * @Date: 2021-08-13 14:23:29
 * @LastEditTime: 2021-08-17 13:30:13
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \briup\网易考拉\后台\milk powder backstage.html
-->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>backstage</title>
    <link rel="stylesheet" href="./css/milk powder backstage.css" />
    <script src="./js/jquery-3.6.0.min.js"></script>
    <script src="./bootstrap-4.5.0-dist/js/bootstrap.js"></script>
    <link rel="stylesheet" href="./bootstrap-4.5.0-dist/css/bootstrap.css" />
    <link
      rel="stylesheet"
      href="./fonts/font-awesome-4.7.0/css/font-awesome.css"
    />
  </head>
  <body>
    <!-- 头部 -->
    <div class="header">
      <img src="./images/public/logo.png" alt="error" />
      <p>品质奶粉后台管理系统</p>
    </div>
    <!-- 左边菜单 -->
    <div class="left">
      <div class="list-group">
        <div class="list-group">
          <a href="./overseaManagement.html" class="list-group-item list-group-item-action"
            >海外直购后台管理</a
          >
          <a
            href="./milk powder backstage.html"
            class="
              list-group-item list-group-item-action list-group-item-primary
            "
            >品质奶粉后台管理</a
          >
          <a href="./user.html" class="list-group-item list-group-item-action"
            >用户信息后台管理</a
          >
          <a
            href="./the admin of the charge.html"
            class="
              list-group-item list-group-item-action list-group-item-primary
            "
            >用户充值后台管理</a
          >
          <a href="./exchange.html" class="list-group-item list-group-item-action"
            >积分兑换后台管理</a
          >
          <a
            href="./discount coupon.html"
            class="
              list-group-item list-group-item-action list-group-item-primary
            "
            >优惠券后台管理</a
          >
        </div>
      </div>
    </div>
    <!-- 右边内容框 -->
    <div class="right">
      <!-- 搜索框 -->
      <div class="input-group mb-3" style="width: 60%; margin: 0 auto; margin-top: 5px;">
        <input type="text" class="form-control" placeholder="商品名/商品号/所属类别" aria-label="Recipient's username" aria-describedby="button-addon2">
        <div class="input-group-append">
          <button class="btn btn-outline-secondary btn-revise" type="button" id="button-addon2" style="padding-bottom: 12px; height: 38px;">搜索</button>
        </div>
      </div>
      <!-- 表格 -->
      <table class="table">
        <thead class="thead-dark">
          <tr>
            <th scope="col">商品号</th>
            <th scope="col">商品名</th>
            <th scope="col">新人价￥</th>
            <th scope="col">考拉价￥</th>
            <th scope="col">所属品类</th>
            <th scope="col">操作</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <th scope="row">20210001</th>
            <td>a2白金版（0-6个月）</td>
            <td>232</td>
            <td>245</td>
            <td>品质a2</td>
            <td>
              <!-- 删除按钮 -->
              <button
                type="button"
                class="btn btn-primary"
                data-toggle="modal"
                data-target="#deleteModal"
                style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                删除
              </button>
              <!-- 修改按钮 -->
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addreviseModal" 
              style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                修改
              </button>
            </td>
          </tr>
          <tr>
            <th scope="row">20210002</th>
            <td>a2白金版 （1-3岁）</td>
            <td>209</td>
            <td>220</td>
            <td>品质a2</td>
            <td>
              <button
                type="button"
                class="btn btn-primary"
                data-toggle="modal"
                data-target="#deleteModal"
                style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                删除
              </button>
              <!-- 修改按钮 -->
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addreviseModal"
              style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                修改
              </button>
            </td>
          </tr>
          <tr>
            <th scope="row">20210003</th>
            <td>爱他美 2段</td>
            <td>765</td>
            <td>726</td>
            <td>德国爱他美</td>
            <td>
              <button
                type="button"
                class="btn btn-primary"
                data-toggle="modal"
                data-target="#deleteModal"
                style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                删除
              </button>
              <!-- 修改按钮 -->
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addreviseModal"
              style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                修改
              </button>
            </td>
          </tr>
          <tr>
            <th scope="row">20210004</th>
            <td>爱他美 卓萃 3段</td>
            <td>1133</td>
            <td>1288</td>
            <td>德国爱他美</td>
            <td>
              <button
                type="button"
                class="btn btn-primary"
                data-toggle="modal"
                data-target="#deleteModal"
                style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                删除
              </button>
              <!-- 修改按钮 -->
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addreviseModal"
              style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                修改
              </button>
            </td>
          </tr>
          <tr>
            <th scope="row">20210005</th>
            <td>诺优能荷兰版 4段</td>
            <td>640</td>
            <td>608</td>
            <td>荷兰牛栏</td>
            <td>
              <button
                type="button"
                class="btn btn-primary"
                data-toggle="modal"
                data-target="#deleteModal"
                style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                删除
              </button>
              <!-- 修改按钮 -->
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addreviseModal"
              style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                修改
              </button>
            </td>
          </tr>
          <tr>
            <th scope="row">20210006</th>
            <td>诺优能荷兰版易乐冠 2段</td>
            <td>495</td>
            <td>468</td>
            <td>荷兰牛栏</td>
            <td>
              <button
                type="button"
                class="btn btn-primary"
                data-toggle="modal"
                data-target="#deleteModal"
                style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                删除
              </button>
              <!-- 修改按钮 -->
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addreviseModal"
              style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                修改
              </button>
            </td>
          </tr>
          <tr>
            <th scope="row">20210007</th>
            <td>喜宝欧盟有机 1段</td>
            <td>119</td>
            <td>148</td>
            <td>喜宝</td>
            <td>
              <button
                type="button"
                class="btn btn-primary"
                data-toggle="modal"
                data-target="#deleteModal"
                style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                删除
              </button>
              <!-- 修改按钮 -->
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addreviseModal"
              style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                修改
              </button>
            </td>
          </tr>
          <tr>
            <th scope="row">20210008</th>
            <td>喜宝2+ 5段</td>
            <td>110</td>
            <td>138</td>
            <td>喜宝</td>
            <td>
              <button
                type="button"
                class="btn btn-primary"
                data-toggle="modal"
                data-target="#deleteModal"
                style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                删除
              </button>
              <!-- 修改按钮 -->
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addreviseModal"
              style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                修改
              </button>
            </td>
          </tr>
          <tr>
            <th scope="row">20210009</th>
            <td>美赞臣蓝臻乳 3段</td>
            <td>366</td>
            <td>429</td>
            <td>美赞成</td>
            <td>
              <button
                type="button"
                class="btn btn-primary"
                data-toggle="modal"
                data-target="#deleteModal"
                style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                删除
              </button>
              <!-- 修改按钮 -->
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addreviseModal"
              style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                修改
              </button>
            </td>
          </tr>
          <tr>
            <th scope="row">202100010</th>
            <td>美赞臣港版 3段</td>
            <td>454</td>
            <td>456</td>
            <td>美赞成</td>
            <td>
              <button
                type="button"
                class="btn btn-primary"
                data-toggle="modal"
                data-target="#deleteModal"
                style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                删除
              </button>
              <!-- 修改按钮 -->
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addreviseModal"
              style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                修改
              </button>
            </td>
          </tr>
          <tr>
            <th scope="row">202100011</th>
            <td>惠氏 瑞士S-26 1段</td>
            <td>240</td>
            <td>228</td>
            <td>惠氏</td>
            <td>
              <button
                type="button"
                class="btn btn-primary"
                data-toggle="modal"
                data-target="#deleteModal"
                style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                删除
              </button>
              <!-- 修改按钮 -->
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addreviseModal"
              style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                修改
              </button>
            </td>
          </tr>
          <tr>
            <th scope="row">202100012</th>
            <td>惠氏 瑞士S-26 2段</td>
            <td>221</td>
            <td>240</td>
            <td>惠氏</td>
            <td>
              <button
                type="button"
                class="btn btn-primary"
                data-toggle="modal"
                data-target="#deleteModal"
                style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                删除
              </button>
              <!-- 修改按钮 -->
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addreviseModal"
              style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                修改
              </button>
            </td>
          </tr>
          <tr>
            <th scope="row">202100013</th>
            <td>美素佳儿 荷兰版</td>
            <td>91</td>
            <td>114</td>
            <td>美素佳儿</td>
            <td>
              <button
                type="button"
                class="btn btn-primary"
                data-toggle="modal"
                data-target="#deleteModal"
                style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                删除
              </button>
              <!-- 修改按钮 -->
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addreviseModal"
              style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                修改
              </button>
            </td>
          </tr>
          <tr>
            <th scope="row">202100014</th>
            <td>美素佳儿 美素力</td>
            <td>120</td>
            <td>114</td>
            <td>美素佳儿</td>
            <td>
              <button
                type="button"
                class="btn btn-primary"
                data-toggle="modal"
                data-target="#deleteModal"
                style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                删除
              </button>
              <!-- 修改按钮 -->
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addreviseModal"
              style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                修改
              </button>
            </td>
          </tr>
          <tr>
            <th scope="row">202100015</th>
            <td>雀巢 超级能恩超启能恩</td>
            <td>165</td>
            <td>199</td>
            <td>雀巢</td>
            <td>
              <button
                type="button"
                class="btn btn-primary"
                data-toggle="modal"
                data-target="#deleteModal"
                style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                删除
              </button>
              <!-- 修改按钮 -->
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addreviseModal"
              style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                修改
              </button>
            </td>
          </tr>
          <tr>
            <th scope="row">202100016</th>
            <td>雀巢 健康科学肽敏舒</td>
            <td>330</td>
            <td>348</td>
            <td>雀巢</td>
            <td>
              <button
                type="button"
                class="btn btn-primary"
                data-toggle="modal"
                data-target="#deleteModal"
                style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                删除
              </button>
              <!-- 修改按钮 -->
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addreviseModal"
              style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
              >
                修改
              </button>
            </td>
          </tr>
        </tbody>
      </table>
      <div>
      <!-- 新增按钮 -->
      <button type="button" class="btn btn-primary btn-add" data-toggle="modal" data-target="#addreviseModal"
      style="background-color: #343a40; border:none; color: rgb(223, 223, 223);"
      >
        新增     
      </button>
        <!-- 分页栏 -->
      <nav aria-label="Page navigation example" class="nav">
        <ul class="pagination">
          <li class="page-item">
            <a class="page-link" href="#" aria-label="Previous">
              <span aria-hidden="true">&laquo;</span>
            </a>
          </li>
          <li class="page-item">
            <a class="page-link" href="#"
              >1</span></a
            >
          </li>
          <li class="page-item">
            <a class="page-link" href="#"
              >2</span></a
            >
          </li>
          <li class="page-item"><a class="page-link" href="#">3</a></li>
          <li class="page-item">
            <a class="page-link" href="#" aria-label="Next">
              <span aria-hidden="true">&raquo;</span>
            </a>
          </li>
        </ul>
      </nav>
      </div>
    </div>
    <!-- 删除模态框 -->
    <div
      class="modal fade"
      id="deleteModal"
      tabindex="-1"
      aria-labelledby="deleteModalLabel"
      aria-hidden="true"
    >
      <div class="modal-dialog">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title" id="deleteModalLabel">提示：</h5>
            <button
              type="button"
              class="close"
              data-dismiss="modal"
              aria-label="Close"
            >
              <span aria-hidden="true">&times;</span>
            </button>
          </div>
          <div class="modal-body">是否删除？</div>
          <div class="modal-footer">
            <button
              type="button"
              class="btn btn-secondary"
              data-dismiss="modal"
            >
              否
            </button>
            <button type="button" class="btn btn-primary">是</button>
          </div>
        </div>
      </div>
    </div>
    <!-- 新增或修改模态框 -->
    <div class="modal fade" id="addreviseModal" tabindex="-1" aria-labelledby="addreviseModalLabel" aria-hidden="true">
      <div class="modal-dialog">
       <div class="modal-content">
         <div class="modal-header">
          <h5 class="modal-title" id="addreviseModalLabel">新增或修改信息：</h5>
           <button type="button" class="close" data-dismiss="modal" aria-label="Close">
             <span aria-hidden="true">&times;</span>
           </button>
         </div>
         <!-- 表单 -->
        <div class="modal-body">
          <form>
            <div class="form-row">
              <div class="col">
                <input type="text" class="form-control" placeholder="商品名">
              </div>
            </div>
            <br>
            <div class="form-row">
            <div class="col">
              <input type="number" class="form-control" name="new-price" id="new-price" placeholder="新人价" min="80"><br>
              <input type="number" class="form-control" name="koala-price" id="koala-price" placeholder="考拉价" min="80"><br>
            </div>
            </div>
          </form>
          <!-- 下拉框 -->
          <div class="form-group">
            <select class="form-control" id="reviseFormControlSelect1">
              <optgroup label="所属品类">
              <option>品质a2</option>
              <option>德国爱他美</option>
              <option>爱他美中文版</option>
              <option>荷兰牛栏</option>
              <option>诺优能中文版</option>
              <option>喜宝</option>
              <option>美赞成</option>
              <option>惠氏</option>
              <option>美素佳儿</option>
              <option>雀巢</option>
              </optgroup>
            </select>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
        <button type="button" class="btn btn-primary">提交</button>
      </div>
        </div>
     </div>
    </div>
  </body>
</html>
